<template>
  <div>
    <h1>父组件</h1>
    <h2>子组件值：{{value}}</h2>
    <Children v-if="fathervisble" ref="children" :childrenvalue="childrenvalue" @received="getChildInfo"></Children>
    <button @click="fatherclick" v-if="fatherisshow">父组件点击</button>
    <!-- <button @click="clear">清空值</button> -->
  </div>
</template>
<script>
import  Children from '../componentTemplate/children.vue'
export default {
    components: { Children },
      data() {
        return {
            fathervisble:false,
            childrenvalue:"fathervalue",
            value:"",
            fatherisshow:true
        }
      }
      ,
      methods:{
        fatherclick(){
          this.fathervisble=true;
          this.fatherisshow=false;
          this.$nextTick(()=>{
            this.$refs.children.init();
          })
          console.log("点击事件触发")
        },
        getChildInfo(val){
          this.value=val;
        },
        // clear(){
        //   this.childrenvalue="",
        //   this.value=""
        // }
      }
    }
</script>